import { PureComponent } from 'react';
import {
	Row,
	Col,
	Form,
	Input,
	Select,
	Modal,
	DatePicker,
	Button,
  message
} from 'antd';
import commandPhoto from '@/assets/command.png';
import { exportWord } from 'mhtml-to-word';//导出命令文件
import printJS from 'print-js';
const FormItem = Form.Item;
const { Option } = Select;
const { TextArea } = Input;

@Form.create()
class CommandModal extends PureComponent {

	constructor(props) {
	    super(props);
	    this.state = {

	    }
	}

  handleCheck = () => {
      Modal.success({
          title: '校验成功',
          okText: '确认',
          centered: true,
          onOk() {

          },
          onCancel() {},
      });
  }

  //打印
  print = () => {
    printJS({
      printable: 'print',
      type: 'html'
    });
  }

  //导出命令文件
  handleExport = () => {
    exportWord({
      filename: "命令文件",
      selector: ".export",
      style:''
    })
  }


  render() {
  		const {
			modalVisibleByCommand,
			form,
			handleModalVisibleByCommand,
		} = this.props;
return (
    <Modal
width={900}
centered
destroyOnClose
title="命令文件"
visible={modalVisibleByCommand}
onCancel={() => handleModalVisibleByCommand(false)}
footer={<Button key="back" onClick = {() => handleModalVisibleByCommand(false)}>取消</Button>}
>
<div style={{width: '100%',height: '520px',overflow: 'auto',textAlign: 'center',position: 'relative'}}>
  <Button type="primary" style={{marginRight: '10px',float: 'right'}} onClick={this.print}>
  打印
  </Button>
  <Button type="primary" style={{marginRight: '10px',float: 'right'}} onClick={this.handleExport}>
  导出
  </Button>
  <Button type="primary" style={{marginRight: '10px',float: 'right'}}>
  存档
  </Button>
  <Button type="primary" style={{marginRight: '10px',float: 'right'}}>
  下发
  </Button>
  <div  style={{clear: 'both'}}>
    <img id="print" alt="" src={commandPhoto} style={{width: '80%'}}/>
  </div>

</div>
</Modal>
);
  }

}

export default CommandModal;
